<template>
	<view class="post-item">
	  <!-- <image class="post-img" :src="obj.image" alt="Post Image" /> -->
	  <view class="post-img"  ><h3 class="post-title">{{ obj.title }}</h3></view>
	  <view class="post-details">
		  <view class="text">
			  <h3 class="post-title"></h3>
			<p class="post-meta">{{obj.summary}}</p>
			
			<p class="statu" :class="pagestatus.class">{{pagestatus.status}}</p>
		</view>
	    
		<view class="auditbtn">
			<view class="audit" @click="toaudit">编辑</view>
			<view class="del" @click="delpage">删除</view>
		</view>
	  </view>
	</view>
</template>

<script>
		import myquest from "@/untils/request.js"
	export default{
		name:"auditing",
		props:{
			obj:{
				default:()=>{}
			}
		},
		data(){
			return{
				
			}
		},
		computed:{
			pagestatus(){
				switch (this.$props.obj.status){
					case 3: return {status:"审核不通过",class:"fail"}
					case 0: return {status:"审核中",class:"reviewing"}
					// case 1: return {status:"审核通过",class:"reviewing"}
				}
				
			}
		},
		methods:{
			toaudit(){
				// console.log("跳转到详细");
				uni.navigateTo({
					url:"/pages/router/my/audit",
				}).then(()=>{
					uni.$emit("toaudit",{obj:this.$props.obj})
				})
			},
			delpage(){
				uni.showModal({
					title:"确认删除"+ this.$props.obj.title||"" +"吗？"
				}).then(r=>{
					if(r.confirm){
						//确认删除
				
						//发送请求后就再请求一次
						myquest.delpage(this.$store.state.token,this.$props.obj)
						.then(r=>{
							if(r.data.code===0){  //失败了
								uni.showToast({
									title:r.data.message,
									icon:"success",
									complete() {
										setTimeout(()=>{
											uni.$emit("pagerefresh")
										},500)
									}
								})
							}else {
								uni.showToast({
									title:r.data.message,
									icon:"error"
								})
							}
						})
					}
				})
			}
		},
		mounted() {
			
		}
	}
	
</script>

<style scoped>
	
	.post-list {
	  display: flex;
	  flex-direction: column;
	}
	
	.post-item {
	  box-shadow: #777 2px 0 4px 0;
	  padding: 5px;
	  display: flex;
	  /* margin-bottom: 16px; */
	  width: 94%;
	  margin: 0 auto 16px auto;
	  border-radius: 4px;
	  overflow: hidden;
	}
	
/* 	.post-item:active{
		box-shadow: #444 2px 0 7px 0;
		filter: brightness(0.7);
	} */
	
	.post-img {
		padding: 10px;
		display: flex;
		justify-content: center;
		align-items: center;
		box-sizing: border-box;
	  width: 80px;
	  height: 80px;
	  object-fit: cover;
	  border-radius: 8px;
	  border: #777 solid 1px;
	  margin-right: 16px;
	}
	
	.post-details {
		position: relative;
	  flex: 1;
	}
	
	.post-title {
		max-height: 2ch;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
	  font-size: 16px;
	  font-weight: bold;
	}
	
	.post-meta {
		max-height: 2ch;
		max-width: 70%;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
	  font-size: 14px;
	  max-height: 2ch;
	  text-overflow: ellipsis;
	  white-space: nowrap;
	  overflow: hidden;
	  max-width: 200px;
	  color: #777;
	}
	
	.post-content{
		max-height: 4ch;
		/* max-width: 80%; */
	}
	
	.text{
		margin-top: 10px;
		float: left;
		max-width: 160px;
		max-height: 82px;
		overflow: hidden;
	}
	
	.auditbtn{
		position: absolute;
		/* border: 1px solid black; */
		width: 40%;
		height: 100%;
		right: 0%;
		display: flex;
		justify-content: space-around;
		flex-direction: column;
		align-items: center;
	}
	
	.auditbtn >view{
		border: #777 1px solid;
		border-radius: 4px;
		height: 40%;
		width: 95%;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 16px;
	}
	
	.auditbtn>view:active{
		box-shadow: #777 2px 4px 7px 0 inset;
		filter: brightness(0.7);
	}
	
	.audit{
		color: darkturquoise;
	}
	
	.del{
		color: red;
	}
	
	.reviewing{
		color: #07771a;
	}
	
	.fail{
		color: red;
	}
</style>
